<template>
	<div>
		<strong>商城后台管理系统</strong>
		<div class="avatar">
			<el-avatar size="medium" :src="admin.avatar"></el-avatar>
			<el-dropdown>
				<span class="el-dropdown-link">
					{{admin.name}}<i class="el-icon-arrow-down el-icon--right"></i>
				</span>
				<el-dropdown-menu slot="dropdown">
					<el-dropdown-item @click.native="logout()">退出登录</el-dropdown-item>
				</el-dropdown-menu>
			</el-dropdown>
		</div>
	</div>

</template>

<script>
	import Element from 'element-ui'
	export default {
		data() {
			return {
				admin: {
					id: '',
					name: '',
					avatar: ''
				}
			}
		},
		created() {
			this.getAdminInfo();
		},
		methods: {
			getAdminInfo(){
				this.$axios.get("/adminInfo").then(res=>{
					this.admin=res.data.data
				})
			},
			logout(){
				this.$axios.get("/logOut").then(res=>{
					//清除信息
					localStorage.clear()
					sessionStorage.clear()
					
					this.$store.commit("resetState")
					
					this.$router.replace("/login")
					Element.Message.success("退出成功！",{
						duration: 3000
					})
					
				})
			}

		}
	}
</script>

<style scoped>
	.avatar {

		float: right;
		width: 12%;
		display: flex;
		justify-content: space-around;
		align-items: center;
		cursor: pointer;
	}
</style>
